--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Commit 9dbc63b482f46e8c03291796b8044f53e77c4308
Parents : 15198b6
Author : Ivan <ivan@quad4.io>
Signature : Signature validation error
Date : 2026-04-01T12:11:23+03:00
feat(vite.config): improve chunk grouping with priority settings and add shared-async group for better optimization
Changes
2 files changed, 29 insertions(+), 17 deletions(-)
Diff
diff --git a/meshchatx/src/frontend/main.js b/meshchatx/src/frontend/main.js
index b5ab4ce2..af4746db 100644
--- a/meshchatx/src/frontend/main.js
+++ b/meshchatx/src/frontend/main.js
@@ -12,6 +12,8 @@ import { ensureCodec2ScriptsLoaded } from "./js/Codec2Loader";
import { createApiClient } from "./js/apiClient.js";
import App from "./components/App.vue";
+import ChangelogModal from "./components/ChangelogModal.vue";
+import TutorialModal from "./components/TutorialModal.vue";
import GlobalState from "./js/GlobalState";
const localeModules = import.meta.glob("./locales/*.json", { eager: true });
@@ -264,13 +266,13 @@ const router = createRouter({
{
name: "changelog",
path: "/changelog",
- component: defineAsyncComponent(() => import("./components/ChangelogModal.vue")),
+ component: ChangelogModal,
meta: { isPage: true },
},
{
name: "tutorial",
path: "/tutorial",
- component: defineAsyncComponent(() => import("./components/TutorialModal.vue")),
+ component: TutorialModal,
meta: { isPage: true },
},
],
diff --git a/vite.config.js b/vite.config.js
index b50b7655..5a10dbab 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -5,20 +5,20 @@ import vue from "@vitejs/plugin-vue";
import vuetify from "vite-plugin-vuetify";
const vendorChunkGroups = [
- { test: /[/\\]node_modules[/\\]vuetify/, name: "vendor-vuetify" },
- { test: /[/\\]node_modules[/\\](vis-network|vis-data)/, name: "vendor-vis" },
- { test: /[/\\]node_modules[/\\]vue-router/, name: "vendor-vue-router" },
- { test: /[/\\]node_modules[/\\](protobufjs|@protobufjs)/, name: "vendor-protobuf" },
- { test: /[/\\]node_modules[/\\]dayjs/, name: "vendor-dayjs" },
- { test: /[/\\]node_modules[/\\]@mdi(?:\/|\\)js/, name: "vendor-mdi" },
- { test: /[/\\]node_modules[/\\]compressorjs/, name: "vendor-compressor" },
- { test: /[/\\]node_modules[/\\]click-outside-vue3/, name: "vendor-click-outside" },
- { test: /[/\\]node_modules[/\\]mitt/, name: "vendor-mitt" },
- { test: /[/\\]node_modules[/\\]micron-parser/, name: "vendor-micron" },
- { test: /MicronParser\.js/, name: "vendor-micron" },
- { test: /[/\\]node_modules[/\\]electron-prompt/, name: "vendor-electron-prompt" },
- { test: /[/\\]node_modules[/\\].*vue/, name: "vendor-vue" },
- { test: /[/\\]node_modules[/\\]/, name: "vendor-other" },
+ { test: /[/\\]node_modules[/\\]vuetify/, name: "vendor-vuetify", priority: 100 },
+ { test: /[/\\]node_modules[/\\](vis-network|vis-data)/, name: "vendor-vis", priority: 95 },
+ { test: /[/\\]node_modules[/\\]vue-router/, name: "vendor-vue-router", priority: 90 },
+ { test: /[/\\]node_modules[/\\](protobufjs|@protobufjs)/, name: "vendor-protobuf", priority: 85 },
+ { test: /[/\\]node_modules[/\\]dayjs/, name: "vendor-dayjs", priority: 80 },
+ { test: /[/\\]node_modules[/\\]@mdi(?:\/|\\)js/, name: "vendor-mdi", priority: 75 },
+ { test: /[/\\]node_modules[/\\]compressorjs/, name: "vendor-compressor", priority: 70 },
+ { test: /[/\\]node_modules[/\\]click-outside-vue3/, name: "vendor-click-outside", priority: 65 },
+ { test: /[/\\]node_modules[/\\]mitt/, name: "vendor-mitt", priority: 60 },
+ { test: /[/\\]node_modules[/\\]micron-parser/, name: "vendor-micron", priority: 55 },
+ { test: /MicronParser\.js/, name: "vendor-micron", priority: 55 },
+ { test: /[/\\]node_modules[/\\]electron-prompt/, name: "vendor-electron-prompt", priority: 50 },
+ { test: /[/\\]node_modules[/\\].*vue/, name: "vendor-vue", priority: 45 },
+ { test: /[/\\]node_modules[/\\]/, name: "vendor-other", priority: 10 },
];
// Purge old assets before build to prevent accumulation
@@ -50,6 +50,7 @@ export default defineConfig({
build: {
sourcemap: false,
+ chunkSizeWarningLimit: 700,
minify: "terser",
terserOptions: {
compress: {
@@ -76,7 +77,16 @@ export default defineConfig({
},
output: {
codeSplitting: {
- groups: vendorChunkGroups,
+ minSize: 20_000,
+ groups: [
+ ...vendorChunkGroups,
+ {
+ name: "shared-async",
+ minShareCount: 2,
+ minSize: 10_000,
+ priority: 5,
+ },
+ ],
},
},
},
──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────